<template>
    <div>{{msg}}</div>
    <div class="mui-content ucenterProfile mui-scroll-wrapper">
        <div class="mui-scroll">
            <!--头像-->
            <ul class="mui-table-view avatar mgb1">
                <li class="mui-table-view-cell">
                    <a id="head" class="mui-navigate-right">头像
                        <span class="mui-pull-right head">
                            <img class="head-img mui-action-preview" id="head-img1" v-bind:src="profile.peopleImage">
                        </span>
                    </a>
                </li>
            </ul>
            <!--信息-->
            <ul class="mui-table-view mgb1">
                <li class="mui-table-view-cell">
                    <a class="text2">昵称<span class="mui-pull-right color2">{{profile.peopleNickName}}</span></a>
                </li>
                <li class="mui-table-view-cell">
                    <a class="text2">性别<span class="mui-pull-right color2">{{profile.peopleSex | sexFilter}}</span></a>
                </li>
                <li class="mui-table-view-cell" v-link="{name:'boundPhone'}" v-if="profile.peoplePhone == null || profile.peoplePhone == ''">
                    <a class="text2 mui-navigate-right">暂未绑定手机<span class="mui-pull-right color3 mgr1">立即绑定</span></a>
                </li>
            </ul>
            <!--安全信息-->
            <ul class="mui-table-view mgb1" v-if="profile.peoplePhone != null && profile.peoplePhone != ''">
                <li class="mui-table-view-cell">
                    <p class="text5">安全信息</p>
                </li>
                <li class="mui-table-view-cell" v-link="{name:'boundPhone'}">
                    <a class="text2 mui-navigate-right">绑定手机<span class="mui-pull-right color2 mgr1">{{profile.peoplePhone | starPhone}}</span></a>
                </li>
            </ul>
        </div>
    </div>
</template>
<style>
    /*头像*/
    .ucenterProfile .head-img{width: 1.2rem; height: 1.2rem; border-radius: 50%;}
    .ucenterProfile #head{font-size:.3rem; line-height: 1.2rem;}
    .ucenterProfile #head .head{width: 1.2rem; height: 1.2rem;  margin-right: 0.35rem;}
</style>
<script type="text/ecmascript-6">
		import '../../fonts/mui.css';
        export default {
            vuex:{
                getters:{
                    profile(state) {
                        return state.profile;
                    }
                }
            },
            data(){
                return{
                }
            },
            ready () {
                /*上拉下拉*/
                mui('.mui-scroll-wrapper').scroll({
                    indicators: true, //是否显示滚动条
                    deceleration : 0.0005,
                });
            },
    };

</script>